/**
 * @file 转换css 工具文件
 */

const postcss = require('postcss')
const postcssJs = require('postcss-js')
const autoprefixer = require('autoprefixer')

const style = {
    userSelect: 'none',
    transition: '.3s',
    display: 'flex'
};

let result = postcssJs.sync([autoprefixer])(style)

// css-in-js  to  css
// postcss().process(result, {parser: postcssJs}).then(result => {
//     console.log(result.css)
// })

let css = `
    div {
        display: flex;
        user-select: none;
        transition: .3s;
    }
    input:placeholder {
        color: #fff;
    }
`



// console.log(autoprefixer)
// console.log(newAutoprefixer)

// postcss([newAutoprefixer]).process(css).then(res => {
//     console.log(res.css)
// })

export default function(css, browerlist) {
    console.log(browerlist)

    let newAutoprefixer = autoprefixer({
        overrideBrowserslist: browerlist
    })

    // return new Promise((resolve, reject) => {
    //     postcss([newAutoprefixer]).process(css).then(res => {
    //         resolve(res)
    //     }).catch(err => {
    //         reject(err)
    //     })
    // })
    return postcss([newAutoprefixer]).process(css)
}

